<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="<%=basePath%>" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>新增设备</title>
<link href="static/css/style.css" rel="stylesheet" type="text/css" />
<link href="static/css/select.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="static/js/jquery.js"></script>
<script type="text/javascript" src="static/js/jquery.idTabs.min.js"></script>
<script type="text/javascript" src="static/js/select-ui.min.js"></script>
<script type="text/javascript" src="static/editor/kindeditor.js"></script>
<!-- 日历控件 -->
<script type="text/javascript" src="static/js/laydate.js"></script>

<script type="text/javascript">	

</script>

<script type="text/javascript">
    KE.show({
        id : 'content7',
        cssPath : './index.css'
    });
</script> 
<script type="text/javascript">
$(document).ready(function(e) {
    $(".select1").uedSelect({
		width : 345			  
	});
	$(".select2").uedSelect({
		width : 167  
	});
	$(".select3").uedSelect({
		width : 100
	});
});
</script>
<script type="text/javascript">
	window.onload=function(){
		// 实验室下拉框
		$("#eli").attr("value", ${updateEquipment.laboratory.id});
		$("#labList").change(function(){
			$("#eli").attr("value", $("#labList").val());
		});
		
		// 设备类型下拉框
		$("#eet").attr("value", ${updateEquipment.equipType}).val();
		$("#equipTypeList").change(function(){
			$("#eet").attr("value", $("#equipTypeList").val());
		});
		
	};
</script>
<% 
List<String> equipTypes = new ArrayList<String>();
	equipTypes.add("话筒");
	equipTypes.add("投影");
	equipTypes.add("功放");
	equipTypes.add("空调");
	equipTypes.add("电脑");	
%>
<script type="text/javascript">
$(function(){   
	$('#createEquip').click(function() {
			var equipName = $('#equipName').val();
			var manufacturer = $('#manufacturer').val();
			var start = $('#start').val();
			var end = $('#end').val();
			if (equipName == '') {
				alert('设备名称不能为空！');
				return false;
			} 
			if (manufacturer == '') {
				alert('厂商不能为空！');
				return false;
			} 
			if (start == '') {
				alert('请选择生产日期！');
				return false;
			} 
			if (end == '') {
				alert('请选择保修日期！');
				return false;
			} 
			$('#addEquip').submit();
		});
	});
</script>

</head>

<body>

	<div class="place">
    <span>位置：</span>
    <ul class="placeul">
    <li><a href="PageFrame_index.action">首页</a></li>
    </ul>
    </div>
    
    <div class="formbody">
    
    
    <div id="usual1" class="usual"> 
    
    <div class="itab">
  	<ul> 
    <li><a href="#tab1" class="selected">新增设备</a></li> 
  	</ul>
    </div> 
    
    <form name="addEquip" action="Equipment_doUpdate" method="post">
  	<div id="tab1" class="tabson">
    
    <div class="formtext">Hi，<b>${user.userName}</b>，欢迎您试用新增设备功能！</div>
    
    <ul class="forminfo">
    <li><label>实验室名称<b>*</b></label>     
    <div class="vocation">
    	<!-- 如果使用 select1 可能导致取不到值-->
    	<select id="labList" name="test" class="select2">   	
    	<c:forEach items="${laboratorys}" var="laboratory">
    	<c:choose>
    	<c:when test="${laboratory.id == updateEquipment.laboratory.id}">   	
    	<option value="${laboratory.id}" selected="selected"> ${laboratory.labName} </option>
    	</c:when>
    	<c:otherwise>
    	<option value="${laboratory.id}"> ${laboratory.labName} </option>
    	</c:otherwise>
    	</c:choose>
    	</c:forEach>

	    </select>
	  </div> 
    </li>
    <li><input type="hidden" id="eli" name="equipment.laboratory.id" value=""/>  </li>     
    <li><label>设备名称<b>*</b></label><input id="equipName" name="equipment.equipName" type="text" class="dfinput" value="${updateEquipment.equipName}"  /></li>
 	<li><label>设备类型<b>*</b></label>
 	   <div class="vocation">
 	   <c:set var="ue" value="${updateEquipment.equipType}" scope="request"></c:set>
    	<!-- 如果使用 select1 可能导致取不到值-->
    	<select id="equipTypeList" name="test" class="select2">
    	<% for(int i=0;i<equipTypes.size();i++){ %>
    		<% if(request.getAttribute("ue").equals(equipTypes.get(i))){ %>
    			<option value="<%= request.getAttribute("ue") %>" selected="selected"><%= request.getAttribute("ue") %> </option>
    		<%}else{ %>
    			<option value="<%= equipTypes.get(i) %>"><%= equipTypes.get(i) %> </option>
    	<%
    	} 
    		} 
    	%>
	    </select>
	  </div> 
 	<input type="hidden" id="eet" name="equipment.equipType" type="text" class="dfinput" value=""  />
 	</li>
 	<li><label>厂商<b>*</b></label><input id="manufacturer" name="equipment.manufacturer" type="text" class="dfinput" value="${updateEquipment.manufacturer}"  /></li>
 	<!-- 日历控件 -->
 	<li><label>生产日期<b>*</b></label><input id="start" name="equipment.manufactureDate" type="text" style="height: 35px;width : 147px; " class="laydate-icon" value="${updateEquipment.manufactureDate}"  /></li>
 	<li><label>保修日期<b>*</b></label><input id="end" name="equipment.repairDate" type="text" style="height: 35px;width : 147px; " class="laydate-icon" value="${updateEquipment.repairDate}"  /></li>
		
	<li><input type="hidden" name="equipment.id" type="text" class="dfinput" value="${updateEquipment.id}"  style="width:250px;"/></li>
   	<li><input type="hidden" name="equipment.createDate" type="text" class="dfinput" value="${updateEquipment.createDate}"  style="width:250px;"/></li>
   	<li><input type="hidden" name="equipment.createUserName" type="text" class="dfinput" value="${updateEquipment.createUserName}"  style="width:250px;"/></li>
    <li><label>&nbsp;</label><input id="createEquip" name="" type="submit" class="btn" value="马上创建"/></li>
    </ul>
    
    </div> 
    </form>
    
	</div> 
 
	<script type="text/javascript"> 
      $("#usual1 ul").idTabs(); 
    </script>
    
    <script type="text/javascript">
	$('.tablelist tbody tr:odd').addClass('odd');
	</script>


		<script type="text/javascript">
			!function() {
				laydate.skin('molv');//切换皮肤，请查看skins下面皮肤库
				laydate({
					elem : '#demo'
				});//绑定元素
			}();

			//日期范围限制
			var start = {
				elem : '#start',
				format : 'YYYY-MM-DD',
				min : '1982-06-16', //设定最小日期
				max : '2099-06-16', //最大日期
				istime : true,
				istoday : false,
				choose : function(datas) {
					end.min = datas; //开始日选好后，重置结束日的最小日期
					end.start = datas; //将结束日的初始值设定为开始日
				}
			};

			var end = {
				elem : '#end',
				format : 'YYYY-MM-DD',
				min : '1982-06-16',
				max : '2099-06-16',
				istime : true,
				istoday : false,
				choose : function(datas) {
					start.max = datas; //结束日选好后，充值开始日的最大日期
				}
			};

			laydate(start);
			laydate(end);

			//自定义日期格式
			laydate({
				elem : '#test1',
				format : 'YYYY年MM月DD日',
				festival : true, //显示节日
				choose : function(datas) { //选择日期完毕的回调
					alert('得到：' + datas);
				}
			});

			//日期范围限定在昨天到明天
			laydate({
				elem : '#hello3',
				min : laydate.now(-1), //-1代表昨天，-2代表前天，以此类推
				max : laydate.now(+1)
			//+1代表明天，+2代表后天，以此类推
			});
		</script>


	</div>


</body>

</html>
